<template>
  <div style="min-height: calc(100vh - .7rem - 40px - .5rem - .1rem)">
    <template v-if="isHavePatent===true">
      <p class="no-patent-tip">未发现此公司的科技信息，请查看其他信息。</p>
    </template>
    <template v-else>
      <div class="card-box">
        <!-- 企业领域分布 -->
        <el-card
          ref="card1"
          class="elcard"
          style="flex: 0.6; align-self: normal; margin-right: 10px"
        >
          <div slot="header" class="hd clearfix">
            <span class="tit">企业领域分布</span>
          </div>
          <div id="chartOne" style="width: 100%; height: 340px"></div>
          <div class="one-list-box">
            <ul class="one-list">
              <li
                v-for="(item, index) in oneList"
                :key="index"
                :class="{ active: index === Index }"
                @click="changeKey(item.key)"
              >
                <p>
                  <span :style="{ 'background-color': item.color }"></span
                  >{{ item.key }}
                </p>
                <i>{{ item.percentage }}%</i>
              </li>
            </ul>
          </div>
        </el-card>
        <!-- 竞品企业 -->
        <el-card
          class="elcard"
          style="flex: 0.4; align-self: normal; margin-left: 10px"
        >
          <div slot="header" class="clearfix">
            <i></i
            ><span
              style="display: inline-block; margin-right: 4px; font-weight: bold"
              >竞品企业</span
            >
            <el-tooltip
              class="item"
              effect="dark"
              content="评估参考：业务收入、技术方向、产品、经营范围、技术竞争等"
              placement="right"
            >
              <span
                class="tip-icon el-icon-warning-outline"
                style="font-size: 14px; font-weight: bold"
              ></span>
            </el-tooltip>
          </div>
          <el-table
            :data="competingGoodsData"
            :default-sort="{ prop: 'similarity', order: 'descending' }"
            :row-class-name="rankingRowClassName"
            height="480"
            class="competingGoods-box"
          >
            <!-- 序号 -->
            <el-table-column type="index" label="序号" width="60" align="center">
            </el-table-column>
            <!-- 公司名称 -->
            <el-table-column prop="companyName" label="公司名称">
            </el-table-column>
            <!-- 相似度 -->
            <el-table-column
              prop="similarity"
              label="相似度"
              align="center"
              sortable
              width="90"
            >
              <template slot-scope="scope">
                <div v-if="scope.row.companyName !== companyName">
                  <span
                    v-if="scope.row.companySimLevel === '高'"
                    class="highcolor"
                    >{{ scope.row.companySimLevel }}</span
                  >
                  <span
                    v-else-if="scope.row.companySimLevel === '极高'"
                    class="highcolor2"
                    >{{ scope.row.companySimLevel }}</span
                  >
                  <span v-else>{{ scope.row.companySimLevel }}</span>
                  <template v-if="scope.row.companySimInfoStr">
                    <el-tooltip effect="dark" placement="right">
                      <div
                        slot="content"
                        v-html="scope.row.companySimInfoStr"
                        class="tooltip-content"
                      ></div>
                      <span class="tip-icon2 el-icon-warning-outline"></span>
                    </el-tooltip>
                  </template>
                </div>
              </template>
            </el-table-column>
            <!-- 创新能力评级 -->
            <el-table-column
              prop="companyScore"
              label="创新能力评级"
              align="center"
              sortable
              width="140"
            >
              <template slot-scope="scope">{{
                scope.row.companyScoreLevel
              }}</template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
      <div class="card-box">
        <!-- 科技成果概况 -->
        <el-card class="elcard" style="flex: 0.4; margin-right: 10px">
          <div slot="header" class="clearfix">
            <span class="tit">科技成果概况</span>
          </div>
          <div style="height: 390px">
            <ul class="achievements">
              <li>
                <p class="info2 clearfix">
                  <span><i>专利拥有量：</i>{{ patentCount.patentNum }}件</span>
                </p>
                <p class="info3 clearfix">
                  <span
                    >自主申请：<i>{{ patentCount.applyNum }}件</i></span
                  >
                  <span
                    >购买专利：<i>{{ patentCount.buyNum }}件</i></span
                  >
                  <span
                    >失效专利：<i>{{ patentCount.invalidNum }}件</i></span
                  >
                  <span
                    >被许可专利：<i>{{ patentCount.licenseNum }}件</i></span
                  >
                  <span
                    >转出：<i>{{ patentCount.sellNum }}件</i></span
                  >
                </p>
              </li>
              <li>
                <p class="info2 clearfix">
                  <span
                    ><i
                      >论文拥有量：{{
                        patentCount2["paper"] && patentCount2["paper"]["all"]
                      }}</i
                    >件</span
                  >
                </p>
                <p class="info3 clearfix">
                  <span
                    >期刊论文：{{
                      (patentCount2["paper"]["期刊"] &&
                        patentCount2["paper"]["期刊"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                  <!-- <span>学位论文：{{patentCount2['paper']['学位']&&patentCount2['paper']['学位'].doc_count||0}}<i>件</i></span>
                  <span>其他：{{patentCount2['paper']['其它']&&patentCount2['paper']['其它'].doc_count||0}}<i>件</i></span> -->
                </p>
              </li>
              <li>
                <p class="info2 clearfix">
                  <span
                    ><i
                      >标准拥有量：{{
                        patentCount2["biaozhun"] &&
                        patentCount2["biaozhun"]["all"]
                      }}</i
                    >件</span
                  >
                </p>
                <p class="info3 clearfix">
                  <span
                    >现行：{{
                      (patentCount2["biaozhun"]["现行"] &&
                        patentCount2["biaozhun"]["现行"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                  <span
                    >即将实施：{{
                      (patentCount2["biaozhun"]["即将实施"] &&
                        patentCount2["biaozhun"]["即将实施"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                  <span
                    >废止：{{
                      (patentCount2["biaozhun"]["废止"] &&
                        patentCount2["biaozhun"]["废止"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                </p>
              </li>
              <li>
                <p class="info2 clearfix">
                  <span
                    ><i
                      >成果拥有量：{{
                        patentCount2["chengguo"] &&
                        patentCount2["chengguo"]["all"]
                      }}</i
                    >件</span
                  >
                </p>
                <p class="info3 clearfix">
                  <span
                    >成熟应用阶段：{{
                      (patentCount2["chengguo"]["成熟应用阶段"] &&
                        patentCount2["chengguo"]["成熟应用阶段"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                  <span
                    >初期阶段：{{
                      (patentCount2["chengguo"]["初期阶段"] &&
                        patentCount2["chengguo"]["初期阶段"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                  <span
                    >中期阶段：{{
                      (patentCount2["chengguo"]["中期阶段"] &&
                        patentCount2["chengguo"]["中期阶段"].doc_count) ||
                      0
                    }}<i>件</i></span
                  >
                </p>
              </li>
            </ul>
            <!-- <el-table
              :data="patentListItems"
              :span-method="objectSpanMethod"
              style="width: 100%; margin-top: 20px;"
              :header-cell-style="patentHeaderStyle"
              :cell-style="patentCellStyle"
              :cell-class-name="cellStyle"
              class="to-eltable2">
              <el-table-column
                prop="national"
                label="专利国家/地区"
                width="120"
                align="center">
              </el-table-column>
              <el-table-column
                prop="type"
                align="center"
                label="专利类型">
              </el-table-column>
              <el-table-column
                prop="apply"
                align="center"
                label="申请">
              </el-table-column>
              <el-table-column
                prop="valid"
                align="center"
                label="有效">
              </el-table-column>
            </el-table> -->
          </div>
        </el-card>
        <!-- 行业技术水平 -->
        <el-card class="elcard" style="flex: 0.6; margin-left: 10px">
          <div slot="header" class="clearfix">
            <span class="tit">行业技术水平</span>
          </div>
          <div id="chartTwo" style="width: 100%; height: 390px"></div>
        </el-card>
      </div>
      <div class="card-box">
        <!-- 企业专利明细评分 -->
        <el-card
          class="elcard"
          style="flex: 0.6; align-self: normal; margin-right: 10px"
        >
          <div slot="header" class="clearfix">
            <span class="tit">企业专利明细评分</span>
          </div>
          <div>
            <ul class="range clearfix">
              <li
                v-for="(item, index) in intervalArr"
                :key="index"
                @click="queryInterval(item.value)"
                :class="{ 'range-active': activeVal === item.value }"
              >
                {{ item.name }}
              </li>
            </ul>
            <el-table
              :data="queryRangeData"
              style="width: 100%; margin-top: 20px"
              height="263"
              :header-cell-style="patentHeaderStyle"
              :cell-style="patentCellStyle"
            >
              <el-table-column
                type="index"
                label="序号"
                width="50"
                align="center"
              >
              </el-table-column>
              <el-table-column
                prop="t"
                align="left"
                header-align="center"
                label="名称"
              >
              </el-table-column>
              <el-table-column
                prop="pn"
                align="center"
                label="专利号"
                width="140"
              >
                <template slot-scope="scope">
                  <p class="link-p" :title="scope.row.pn">{{ scope.row.pn }}</p>
                </template>
              </el-table-column>
              <el-table-column
                prop="score"
                align="center"
                width="77"
                label="分数"
              >
              </el-table-column>
            </el-table>
            <el-col :span="24" style="text-align:center;padding:10px; 0">
              <el-pagination
                background
                layout="prev, pager, next"
                :total="evaluateTotal"
                :page-size="evaluatePageSize"
                :current-page.sync="evaluateCurrentPage"
                @current-change="getEvaluateCurrentPage"
                class="el-pagination"
              >
              </el-pagination>
            </el-col>
          </div>
        </el-card>
        <!-- 企业技术综合评分 -->
        <el-card
          class="elcard"
          style="flex: 0.4; align-self: normal; margin-left: 10px"
        >
          <div slot="header" class="clearfix">
            <span class="tit">企业技术综合评分</span>
          </div>
          <ul class="evaluation-list">
            <li>
              <p class="title clearfix">
                <span>专利质量</span><span>{{ vprogress1 }}/100</span>
              </p>
              <el-progress
                class="vprogress"
                :percentage="vprogress1"
                :stroke-width="10"
                color="#2f41c8"
                :show-text="false"
              ></el-progress>
              <p class="footer-tip">
                是从特征数量、权项数量、引用情况、稳定性等10个维度对专利质量进行评价
              </p>
            </li>
            <li>
              <p class="title clearfix">
                <span>技术价值</span><span>{{ vprogress2 }}/100</span>
              </p>
              <el-progress
                class="vprogress"
                :percentage="vprogress2"
                :stroke-width="10"
                color="#2f41c8"
                :show-text="false"
              ></el-progress>
              <p class="footer-tip">
                是从创新程度、技术时效、技术宽度、生命周期维度评价专利技术价值
              </p>
            </li>
            <li>
              <p class="title clearfix">
                <span>市场价值</span><span>{{ vprogress3 }}/100</span>
              </p>
              <el-progress
                class="vprogress"
                :percentage="vprogress3"
                :stroke-width="10"
                color="#2f41c8"
                :show-text="false"
              ></el-progress>
              <p class="footer-tip">
                是从投融资情况、行业基数、转让许可、质押融资、市场势能等维度评价市场价值
              </p>
            </li>
            <li>
              <p class="title clearfix">
                <span>社会价值</span><span>{{ vprogress4 }}/100</span>
              </p>
              <el-progress
                class="vprogress"
                :percentage="vprogress4"
                :stroke-width="10"
                color="#2f41c8"
                :show-text="false"
              ></el-progress>
              <p class="footer-tip">
                是从复审无效、焦点事件、政策法规等维度评价专利的社会价值
              </p>
            </li>
          </ul>
        </el-card>
      </div>
    </template>
  </div>
</template>
<script>
import axios from "axios";
import { mapState } from "vuex";
import resize from "@/utils/resize";
import Colors from "@/utils/chartsColors";
import IndustryTable from "./child/IndustryTable";
export default {
  mixins: [resize],
  inject: ["reload"],
  components: {
    IndustryTable,
  },
  data() {
    return {
      isHavePatent: null, // 是否有专利
      companyName: this.$route.query.name || "江苏天奈科技股份有限公司",
      companyId: this.$route.query.eid,
      navActive: -1,
      chartOne: null,
      chartOneData: [],
      oneList: [],
      chartTwo: null,
      maxKey: "",
      Index: "",
      btnActive: 0,
      sellNum: "", // 转出
      // 行业榜单
      competingGoodsData: [],
      // 科技成果概况
      patentCount: {},
      patentCount2: {
        biaozhun: {},
        paper: {},
        chengguo: {},
      },
      patentListItems: [],
      spanArr: [],
      pos: 0,
      patentHeaderStyle: function () {
        return "font-size:12px;color: #86899e;";
      },
      patentCellStyle: function () {
        return "color: #606266";
      },
      // 行业技术水平
      ipcArr: [],
      ipcNumber: 5,
      currentLegendName: "", // 当前选中图例
      // 企业技术综合评分
      intervalArr: [],
      rangeData: [],
      queryRangeData: [], // 选择评分区间数据
      evaluateTotal: 0,
      evaluateCurrentPage: 1,
      evaluateIps: 5,
      evaluatePageSize: 5,
      activeVal: "",
      vprogress1: 0,
      vprogress2: 0,
      vprogress3: 0,
      vprogress4: 0,
      // 当前选中tab
      tabActiveIndex: 1,
      watchCompanyName: "",
    };
  },
  computed: {
    ...mapState(["levelCode", "levelName"]),
  },
  created() {},
  mounted() {
    if (this.$route.query.isHavePatent) {
      this.isHavePatent = this.$route.query.isHavePatent==='true' ? true : false
    }
    this.chartOne = this.$echarts.init(document.getElementById("chartOne"));
    this.chartOne.on("click", this.chartOneClick);
    this.chartTwo = this.$echarts.init(document.getElementById("chartTwo"));
    // 企业领域分布
    this.getChartOneData();
    // 获取竞品公司匹配
    this.getCompetingGoodsData();
    // 科技成果概况
    this.getDocument();
    // this.getCompanyPatentInfo()
    // this.getSell()
    axios.all([this.getCompanyPatentInfo(), this.getSell()]).then(
      axios.spread((res1, res2) => {
        let data1 = res1.data;
        if (data1) {
          let patCountData = data1;
          if (patCountData.patentCount) {
            this.$set(
              this.patentCount,
              "patentNum",
              patCountData.patentCount.patentNum
            ); // 专利拥有量
            this.$set(
              this.patentCount,
              "applyNum",
              patCountData.patentCount.applyNum
            ); // 自主专利
            this.$set(
              this.patentCount,
              "invalidNum",
              patCountData.patentCount.invalidNum
            ); // 失效专利
            this.$set(
              this.patentCount,
              "countryNum",
              patCountData.patentCount.countryNum
            ); // 布局区域
          }

          // let datas = patCountData.patentCount && patCountData.patentCount.type
          // var b = [];
          // if (datas.length>0) {
          //   for (var i=0;i<datas.length;i++) {
          //     for (let j=0;j<datas[i].na.length;j++) {
          //       let name = datas[i].cn_name
          //       b.push({
          //         national: name, // 专利国家
          //         type: datas[i].na[j].name, // 专利类型
          //         value1: datas[i].value,
          //         apply: datas[i].na[j].value, // 申请
          //         valid: datas[i].na[j].valid, // 有效
          //         validArr: datas[i].na[j].validArr,
          //         valueArr: datas[i].na[j].valueArr
          //       })
          //     }
          //   }
          // }

          // this.patentListItems = b
          // this.rowspan(b)
        }

        let data2 = res2.data;
        if (data2) {
          this.patentCount.buyNum = data2.buyNum; // 购买专利
          this.patentCount.licenseNum = data2.transferNum; // 被许可专利
          this.patentCount.sellNum = data2.divertNum; // 转出
        }

        // this.renderEnterprisePatentOverview(this.patentCount)
      })
    );
  },
  methods: {
    goDetail(name) {
      this.$Bus.$emit("progressBar", name);
    },
    // 企业领域分布
    getChartOneData() {
      this.chartOne.showLoading({
        text: "loading",
        color: "#0b0a2b",
        textColor: "#0b0a2b",
        maskColor: "#fff",
        zlevel: 0,
      });

      // this.$get(this.$Url.company.getCompanyIndustryInfo, {
      //   eid: this.$route.query.eid
      // }).then(res => {
      //   let data = res.data
      //   let d = []
      //   data.forEach(v => {
      //     d.push({
      //       key: v.name,
      //       doc_count: v.count
      //     })
      //   })

      //   let chartData = []
      //   d = d.sort(function (a, b) {
      //     return Number(a.doc_count)< Number(b.doc_count) ? 1 : -1;
      //   })
      //   this.chartOneData = d // 保存的一个结果
      //   this.maxKey = d[0].key // 最大key
      //   let num = d[0].doc_count // 最大值
      //   this.renderChartOne(d)
      //   this.getOneList(d)
      // })

      this.$get(this.$Url.science.direction, {
        companyName: this.companyName,
        dataType: "patentAnalysis",
      })
        .then((res) => {
          let data = res.data;
          if (data) {
            let analysisData = data.patentAnalysis;
            // ////
            let d = [];
            for (let i = 0; i < analysisData.ipcPie.length; i++) {
              d.push({
                key: analysisData.ipcPie[i].value,
                doc_count: analysisData.ipcPie[i].num,
              });
            }

            let chartData = [];
            d = d.sort(function (a, b) {
              return Number(a.doc_count) < Number(b.doc_count) ? 1 : -1;
            });
            this.chartOneData = d; // 保存的一个结果
            this.maxKey = d[0].key; // 最大key
            let num = d[0].doc_count; // 最大值
            this.renderChartOne(d);
            this.getOneList(d);
            // ////

            // 行业技术水平
            let ipcArr = analysisData.businessPie.ipcArr;
            this.getTechnicalLevel(ipcArr);
            // 企业技术综合评分
            let scoreBetweenNum = analysisData.complexEchart.scoreBetweenNum;
            this.getEvaluateData(scoreBetweenNum);

            let complexEchart = analysisData.complexEchart;
            let complexDetail = complexEchart.complexDetail;
            if (complexDetail.patentScoreavg) {
              // 专利质量
              this.vprogress1 = Number(complexDetail.patentScoreavg.Q);
              // 技术价值
              this.vprogress2 = Number(complexDetail.patentScoreavg.T);
              // 市场价值
              this.vprogress3 = Number(complexDetail.patentScoreavg.M);
              // 社会价值
              this.vprogress4 = Number(complexDetail.patentScoreavg.S);
            }
          }
        })
        .catch((err) => {});
    },
    renderChartOne(data, isClick) {
      let seriesData = [];
      for (let i in data) {
        let NameColor = "#878696";
        let lineColor = "#ccc";
        let fontWeight = "500";
        if (isClick && data[i].key === this.maxKey) {
          NameColor = "#514bad";
          fontWeight = "bold";
          lineColor = "#514bad";
        }
        seriesData.push({
          name: data[i].key,
          value: data[i].doc_count,
          key: data[i].key,
          label: {
            normal: {
              rich: {
                name: {
                  color: NameColor,
                  fontWeight: fontWeight,
                },
              },
            },
          },
          labelLine: {
            normal: {
              lineStyle: {
                color: lineColor,
              },
            },
          },
        });
      }

      let option = {
        backgroundColor: "#fff",
        tooltip: {
          trigger: "item",
          formatter: "{b}: {c} ({d}%)",
          position: "top",
        },
        color: Colors.color,
        series: [
          {
            type: "pie",
            avoidLabelOverlap: true,
            radius: ["34%", "50%"],
            minAngle: 30,
            startAngle: 70, //起始角度
            data: seriesData,
            itemStyle: {
              normal: {
                borderWidth: 2,
                borderColor: "#fff",
              },
            },
            label: {
              show: true,
              position: "outer",
              alignTo: "labelLine",
              distanceToLabelLine: 5,
              formatter: (params) => {
                let str = "";
                if (params.name.length > 10) {
                  str += `{name|${params.name.substring(0, 10)}...}`;
                } else {
                  str += `{name|${params.name}}`;
                }
                str += `  {name|${params.percent}%}`;
                return str;
              },
              rich: {
                icon: {},
                name: {
                  fontSize: 12,
                  color: "#86899e",
                },
              },
            },
          },
        ],
      };
      this.chartOne.hideLoading();
      this.chartOne.setOption(option, true);
    },
    chartOneClick(v) {
      this.ipi = 1;
      let num = v.data.value;
      // 取消之前的高亮 或者默认
      this.chartOne.dispatchAction({
        type: "downplay",
      });
      if (this.Index !== v.dataIndex) {
        this.Index = v.dataIndex; // 点击高亮
        this.maxKey = v.data.key;
        this.chartOne.dispatchAction({
          type: "highlight",
          dataIndex: this.Index,
        });
        // this.getTableData(v.name)
      } else {
        this.Index = -1;
        this.maxKey = -1;
        // this.getTableData()
      }
      this.renderChartOne(this.chartOneData, true);
    },
    getOneList(data) {
      let pArr = [];
      let keyArr = [];
      let maxCount = 0;
      for (let i in data) {
        keyArr.push(data[i].key.length);
        maxCount += Number(data[i].doc_count);
      }
      let arr = [];
      for (let i in data) {
        arr.push({
          color: Colors.color[i],
          key: data[i].key,
          percentage: ((data[i].doc_count / maxCount) * 100).toFixed(2),
        });
      }
      this.oneList = arr;
    },
    changeKey(key) {
      this.chartOne.dispatchAction({
        type: "downplay",
      });
      if (this.maxKey !== key) {
        for (let i in this.chartOneData) {
          if (key === this.chartOneData[i].key) {
            this.Index = Number(i);
            this.maxKey = key;
            this.chartOne.dispatchAction({
              type: "highlight",
              dataIndex: this.Index,
            });
            break;
          }
        }
      } else {
        this.Index = -1;
        this.maxKey = -1;
      }

      this.renderChartOne(this.chartOneData, true);
    },
    // 行业榜单
    changeBtn(index) {
      this.btnActive = index;
    },
    // 国内技术相似
    getCnList() {
      this.$get(this.$Url.science.companySort, {
        companyName: this.companyName,
        dataType: "cnCompanySort",
      })
        .then((data) => {
          let res = data.data;
          if (res && Object.keys(res).length > 0) {
            this.$Bus.$emit("cnList", res);
            let a = JSON.parse(JSON.stringify(data.data.cnCompanySort));
            if (a.length > 1) {
              let b = a.sort((a, b) => {
                return Number(b.similarity) - Number(a.similarity);
              });
            }
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 国外技术相似
    getEnList() {
      this.$get(this.$Url.science.companySort, {
        companyName: this.companyName,
        dataType: "enCompanySort",
      })
        .then((res) => {
          let data = res.data;
          if (data && Object.keys(data).length > 0) {
            this.$Bus.$emit("enList", data);
            let a = JSON.parse(JSON.stringify(data.enCompanySort));
            // 数据大于1则进行相似度排序
            if (a.length > 1) {
              let b = a.sort((a, b) => {
                return Number(b.similarity) - Number(a.similarity);
              });
            }
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 产品相似
    getProductData() {
      this.$post(this.$Url.science.semblance, {
        url: "enterprise/getEntCompetitionByName",
        name: this.companyName,
      })
        .then((res) => {
          if (res.data) {
            let tradeEnterprisesData = [];
            let data = res.data;
            let companyNames = [];
            for (let i = 0; i < data.length; i++) {
              let dataI = data[i];
              let obj = {};
              if (dataI.ename !== "" && dataI.ename !== "-" && dataI.ename) {
                obj.companyName = dataI.ename;
              } else {
                obj.companyName = dataI.name;
              }
              obj.brief = dataI.brief || "暂无";
              obj.ename = dataI.ename;
              tradeEnterprisesData.push(obj);
              companyNames.push(obj.companyName);
            }
            this.productData = tradeEnterprisesData;

            this.getKcOpponent(companyNames, "productData");
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 批量查询竞争对手
    getKcOpponent(companyNames, dataName) {
      this.$post(this.$Url.evaluation.kcOpponent, companyNames)
        .then((res) => {
          let data = res.data;
          if (data.length > 0) {
            for (let i in data) {
              f: for (let j in this[dataName]) {
                if (data[i] === this[dataName][j].companyName) {
                  this.$set(this[dataName][j], "isOpponent", true);
                  break f;
                }
              }
            }
          }
        })
        .catch((err) => {});
    },
    // 对比
    contrast(scope, data) {
      let row = scope.row;
      let companyName = row.companyName;
      let curData = this[data];
      if (!row.eid) {
        let promise = new Promise((resolve, reject) => {
          this.$post(this.$Url.search.companyList, {
            name: companyName,
            ipi: 1,
            ips: 1,
          })
            .then((res) => {
              let data = res.data;
              if (data) {
                let eid = data.result && data.result[0]._id;
                this.$set(curData[scope.$index], "eid", eid);
                resolve(eid);
              }
            })
            .catch((err) => {});
        });
        promise.then((eid) => {
          if (!row.isOpponent) {
            // 添加竞争对手对比
            this.$post(this.$Url.company.opponentAdd, {
              companyId: eid,
              companyName: companyName,
            })
              .then((res) => {
                if (res.status == 200) {
                  this.$message({
                    type: "success",
                    message: "添加成功",
                    duration: 1000,
                  });
                  this.$set(this[data][scope.$index], "isOpponent", true);
                } else {
                  this.$message({
                    type: "error",
                    message: "添加失败",
                    duration: 1000,
                  });
                }
              })
              .catch((err) => {});
          } else {
            // 取消竞争对手对比
            this.$delete(`${this.$Url.company.opponenDelete}/${eid}`)
              .then((res) => {
                if (res.status == 200) {
                  this.$message({
                    type: "success",
                    message: "取消成功",
                  });
                  this.$set(this[data][scope.$index], "isOpponent", false);
                } else {
                  this.$message({
                    type: "error",
                    message: "取消失败",
                    duration: 1000,
                  });
                }
              })
              .catch((err) => {});
          }
        });
      } else {
        if (!row.isOpponent) {
          // 添加竞争对手对比
          this.$post(this.$Url.company.opponentAdd, {
            companyId: row.eid,
            companyName: companyName,
          })
            .then((res) => {
              if (res.status == 200) {
                this.$message({
                  type: "success",
                  message: "添加成功",
                  duration: 1000,
                });
                this.$set(this[data][scope.$index], "isOpponent", true);
              } else {
                this.$message({
                  type: "error",
                  message: "添加失败",
                  duration: 1000,
                });
              }
            })
            .catch((err) => {});
        } else {
          // 取消竞争对手对比
          this.$delete(`${this.$Url.company.opponenDelete}/${row.eid}`)
            .then((res) => {
              if (res.status == 200) {
                this.$message({
                  type: "success",
                  message: "取消成功",
                });
                this.$set(this[data][scope.$index], "isOpponent", false);
              } else {
                this.$message({
                  type: "error",
                  message: "取消失败",
                  duration: 1000,
                });
              }
            })
            .catch((err) => {});
        }
      }
    },
    // 科技成果概况
    getCompanyPatentInfo() {
      return this.$get(this.$Url.science.companyPatentInfo, {
        companyName: this.companyName,
        dataType: "patentCount",
      });
      //        this.$get(this.$Url.science.details, {
      //         companyName: this.companyName,
      //       }).then(res => {
      //         let data = res.data
      //         if (data) {
      //           let patCountData = data
      //           this.patentCount.patentNum = patCountData.patentNum, // 专利拥有量
      //           this.patentCount.applyNum = patCountData.applyNum, // 自主专利
      //           this.patentCount.invalidNum = patCountData.invalidNum, // 失效专利
      //           this.patentCount.countryNum = patCountData.countryNum // 布局区域
      //           this.renderEnterprisePatentOverview(patCountData)
      //         }
      //       }).catch(err => {
      //         console.log(err)
      //       })
    },
    // 转出
    getSell() {
      return this.$get(this.$Url.patent.patentLegal, {
        companyName: this.companyName,
      });
      //       this.$get(this.$Url.patent.patentLegal, {
      //         companyName: this.companyName
      //       }).then(res => {
      //         let data = res.data
      //         if (data) {
      //           this.$set(this.patentCount, 'buyNum', data.buyNum)// 购买专利
      //           this.$set(this.patentCount, 'licenseNum', data.transferNum) // 被许可专利
      //           this.$set(this.patentCount, 'sellNum', data.divertNum) // 转出
      //         }
      //       }).catch(err => {})
    },
    cellStyle({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        return "borderRight";
      }
    },
    //
    rowspan(data) {
      this.spanArr = [];
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].national === data[i - 1].national) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    // 科技成果概况其它维度
    getDocument() {
      this.$get(this.$Url.EI.document, {
        companyName: this.companyName,
      })
        .then((res) => {
          let data = res.data;
          // 标准
          let biaozhunNum = 0;
          if (data["biaozhun"]) {
            data["biaozhun"].forEach((v) => {
              biaozhunNum += v.doc_count;
            });
          }
          // 论文
          let paperNum = 0;
          if (data["paper"]) {
            data["paper"].forEach((v) => {
              paperNum += v.doc_count;
            });
          }
          // 成果
          let chengguoNum = 0;
          if (data["chengguo"]) {
            data["chengguo"].forEach((v) => {
              chengguoNum += v.doc_count;
            });
          }
          let newData = {
            biaozhun: {
              all: biaozhunNum,
              现行: data["biaozhun"].find((v) => v.key === "现行") || {},
              即将实施:
                data["biaozhun"].find((v) => v.key === "即将实施") || {},
              废止: data["biaozhun"].find((v) => v.key === "废止") || {},
            },
            paper: {
              all: paperNum,
              期刊: data["paper"].find((v) => v.key === "期刊") || {},
            },
            chengguo: {
              all: chengguoNum,
              成熟应用阶段:
                data["chengguo"].find((v) => v.key === "成熟应用阶段") || {},
              中期阶段:
                data["chengguo"].find((v) => v.key === "中期阶段") || {},
              初期阶段:
                data["chengguo"].find((v) => v.key === "初期阶段") || {},
            },
          };
          this.patentCount2 = newData;
        })
        .catch((err) => {});
    },
    // 行业技术水平
    getTechnicalLevel(ipcArr) {
      let color = Colors.color;
      let _ipcArr = JSON.parse(JSON.stringify(ipcArr));
      for (let i in ipcArr) {
        let companyIpcArr = [];
        for (let j in ipcArr[i].companyIpcArr) {
          let obj = ipcArr[i].companyIpcArr[j];
          let key = Object.keys(obj)[0];
          let value = Object.values(obj)[0];
          if (key && key.indexOf("_num") > -1) {
            key = Object.keys(obj)[1];
            value = Object.values(obj)[1];
          }
          if (key !== "virtual" && (value !== 0 || key === this.companyName)) {
            companyIpcArr.push({
              key: key,
              value: value,
            });
          }
        }
        this.$set(_ipcArr[i], "companyIpcArr", companyIpcArr);
      }
      let xAxisData = [];
      let seriesDataArr = [];
      // 当前企业的值
      let curData = [];
      // 当前排名第一位的值
      let allData = [];
      //
      let coordData = [];
      for (let i in _ipcArr) {
        xAxisData.push(_ipcArr[i].ipcName);

        f: for (let j in _ipcArr[i].companyIpcArr) {
          let key = _ipcArr[i].companyIpcArr[j].key;
          let value = _ipcArr[i].companyIpcArr[j].value;
          if (key === this.companyName) {
            curData.push(value);
            coordData.push({
              coord: [Number(i), _ipcArr[i].companyIpcArr[0].value],
              value: `${Number(j) + 1}/${_ipcArr[i].companyIpcArr.length}`,
            });
            break f;
          }
        }
        // 最大值
        let key = _ipcArr[i].companyIpcArr[0].key;
        let value = _ipcArr[i].companyIpcArr[0].value;
        allData.push({
          name: key,
          value: value,
        });
      }
      seriesDataArr = [
        {
          name: "行业最高分",
          type: "bar",
          data: allData,
          smooth: true,
          symbol: "circle",
          symbolSize: 0,
          markPoint: {
            // symbol: 'pin',
            symbolSize: 24,
            itemStyle: {
              color: "transparent",
            },
            label: {
              show: true,
              fontStyle: "normal",
              borderWidth: 0,
              shadowBlur: 0,
              // position: 'top',
              lineHeight: 12,
              color: "#2f41c8",
              fontSize: 11,
            },
            data: coordData,
          },
          itemStyle: {
            normal: {
              barBorderRadius: [2, 2, 0, 0],
              color: "#b3d4fc",
            },
          },
        },
        {
          name: this.companyName,
          type: "bar",
          barGap: "-100%",
          data: curData,

          itemStyle: {
            normal: {
              barBorderRadius: [2, 2, 0, 0],
              color: Colors.color[0],
            },
          },
        },
      ];
      let lenArr = [];
      for (let i in xAxisData) {
        lenArr.push(xAxisData[i].length);
      }
      let maxLen = Math.max(...lenArr);
      let lcOption = {
        tooltip: {
          confine: true,
          trigger: "axis",
          backgroundColor: "#fff",
          extraCssText: "box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);",
          borderRadius: 0,
          padding: 5,
          textStyle: {
            color: "#000",
          },
          axisPointer: { type: "none" },
          formatter: (params) => {
            let label = params[0].axisValueLabel;
            let index = 0;
            for (let i in xAxisData) {
              if (xAxisData[i] === label) {
                index = Number(i);
              }
            }
            let dr = coordData[index].value.split("/");
            return `${label}<br/>
              ${params[0].marker}${params[0].seriesName}：${params[0].value}<br/>
              ${params[1].marker}${params[1].seriesName}：${params[1].value}<br/>
              行业排名第${dr[0]}名，共${dr[1]}家`;
            // console.log(label)
          },
        },
        legend: {
          type: "scroll",
          top: "10",
          left: "5%",
          right: "5%",
        },
        grid: {
          top: "60",
          right: "20",
          bottom: maxLen * 8 + "px",
        },
        xAxis: {
          type: "category",
          data: xAxisData,
          splitLine: {
            show: false,
            lineStyle: {
              color: "#f0f1f3",
            },
          },
          axisLine: {
            lineStyle: {
              color: "#f0f1f3",
              width: 2,
            },
          },
          axisLabel: {
            borderWidth: 30,
            borderColor: "#ffffff",
            interval: 0,
            rotate: 45,
            fontSize: 10,
            lineHeight: 12,
            textStyle: {
              color: "#9e9e9e",
            },
            verticalAlign: "top",
            formatter: function (value) {
              var ret = ""; //拼接加\n返回的类目项
              var maxLength = 10; //每项显示文字个数
              var valLength = value.length; //X轴类目项的文字个数
              var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
              if (rowN > 1) {
                //如果类目项的文字大于3,
                for (var i = 0; i < rowN; i++) {
                  var temp = ""; //每次截取的字符串
                  var start = i * maxLength; //开始截取的位置
                  var end = start + maxLength; //结束截取的位置
                  //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
                  temp = value.substring(start, end) + "\n";
                  ret += temp; //凭借最终的字符串
                }
                return ret;
              } else {
                return value;
              }
            },
          },
        },
        yAxis: {
          name: `行\n业\n技\n术\n总\n分`,
          nameLocation: "middle",
          nameTextStyle: {
            padding: [0, 14, 0, 0],
            color: "#7674a3",
          },
          nameRotate: 0,
          type: "value",
          splitLine: {
            show: true,
            lineStyle: {
              color: "#f0f1f3",
            },
          },
          axisTick: {
            show: false,
          },
          axisLine: {
            show: false,
            lineStyle: {
              color: "#f0f1f3",
              width: 2,
            },
          },
          axisLabel: {
            textStyle: {
              color: "#9e9e9e",
            },
          },
        },
        dataZoom: [
          {
            id: "dataZoomX",
            type: "inside",
            xAxisIndex: [0],
            filterMode: "filter",
          },
        ],
        barMaxWidth: 20,
        series: seriesDataArr,
      };
      this.chartTwo.setOption(lcOption);
    },
    // 企业专利明细评分
    getEvaluateData(scoreBetweenNum) {
      let scoreKeys = Object.keys(scoreBetweenNum);
      let maxKey = scoreKeys[scoreKeys.length - 1];
      this.activeVal = Number(maxKey);
      this.$post(this.$Url.science.evaluate, {
        ipi: this.evaluateCurrentPage,
        ips: this.evaluateIps,
        between: this.evaluateCode,
        betweenNum: maxKey,
        companyName: this.companyName,
      })
        .then((data) => {
          if (data.data) {
            let result = data.data.result;
            this.queryRangeData = result;
            this.evaluateTotal = data.data.total;
            this.getComplexEchart(scoreKeys);
          }
        })
        .catch((err) => console.log(err));
    },
    // 企业专利明细评分-获取区间
    getComplexEchart(data) {
      let arr = [];
      for (let i = 0; i < data.length; i++) {
        arr.push(Number(data[i]));
      }
      arr = Array.from(new Set(arr));
      arr = arr.sort((a, b) => {
        return a - b;
      });
      for (let i = 0; i < arr.length; i++) {
        let obj = {
          name: `${arr[i] * 10}-${arr[i] * 10 + 10}`,
          value: arr[i],
        };
        this.intervalArr.push(obj);
      }
    },
    // 企业技术综合评分-选择区间
    queryInterval(val) {
      this.activeVal = val;
      this.$post(this.$Url.science.evaluate, {
        ipi: this.evaluateCurrentPage,
        ips: this.evaluateIps,
        between: this.evaluateCode,
        betweenNum: val,
        companyName: this.companyName,
      })
        .then((data) => {
          if (data.data) {
            let result = data.data.result;
            this.queryRangeData = result;
            this.evaluateTotal = data.data.total;
          }
        })
        .catch((err) => console.log(err));
    },
    // 企业技术综合评分-分页
    getEvaluateCurrentPage(val) {
      this.evaluateCurrentPage = val;
      this.$post(this.$Url.science.evaluate, {
        ipi: this.evaluateCurrentPage,
        ips: this.evaluateIps,
        between: this.evaluateCode,
        betweenNum: this.activeVal,
        companyName: this.companyName,
      })
        .then((data) => {
          if (data.data) {
            let result = data.data.result;
            this.queryRangeData = result;
          }
        })
        .catch((err) => console.log(err));
    },
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2) {
        return "warning-row";
      }
      return "";
    },
    handleNav(index) {
      if (this.navActive !== index) {
        this.navActive = index;
      } else {
        this.navActive = -1;
      }
    },
    // 竞品企业
    getCompetingGoodsData() {
      this.$get(this.$Url.science.companySort, {
        companyName: this.companyName,
        dataType: "cnCompanySort",
      })
        .then((res) => {
          let data = res.data;
          if (data && data.cnCompanySort) {
            data.cnCompanySort.sort((a, b) => {
              return b.companyScore - a.companyScore;
            });

            data.cnCompanySort.forEach((v) => {
              let targetCompanyName = v.companyName;
              if (v.companySimInfo) {
                let companySimInfo = JSON.parse(v.companySimInfo);
                if (
                  companySimInfo.explain_type &&
                  companySimInfo.explain_type !== "" &&
                  companySimInfo.explain_info
                ) {
                  let type = companySimInfo.explain_type;
                  let info = JSON.parse(
                    JSON.stringify(companySimInfo.explain_info)
                  );
                  let str = "";
                  switch (type) {
                    case "person":
                      str += "核心人员";
                      break;
                    case "technology":
                      str += "研究方向";
                      break;
                    case "product":
                      str += "产业布局";
                      break;
                    case "scope":
                      str += "业务范围";
                      break;
                  }
                  let str2 = "";
                  if (info instanceof Array) {
                    info.forEach((b, j) => {
                      this.$set(info, j, `"${b}"`);
                    });
                    str2 = info.join("，");
                    v.companySimInfoStr = str + str2 + "相似度极高";
                  } else {
                    let str3 = "";
                    // 如果有A2B
                    if (info.A2B && info.A2B.length > 0) {
                      let personArr = [];
                      info.A2B.forEach((b) => {
                        personArr.push(`${b.name_zh}`);
                      });
                      str3 += `${this.companyName}<br/>${str}：${personArr.join(
                        "，"
                      )}<br/><span style="color:#FF6E6E">跳槽到</span>${targetCompanyName}<br/>`;
                    }
                    if (
                      info.A2B &&
                      info.A2B.length > 0 &&
                      info.B2A &&
                      info.B2A.length > 0
                    ) {
                      str3 += `<hr style="margin: 4px 0; border-bottom:1px dashed #fff;"/>`;
                    }
                    // 如果有B2A
                    if (info.B2A && info.B2A.length > 0) {
                      let personArr = [];
                      info.B2A.forEach((b) => {
                        personArr.push(`${b.name_zh}`);
                      });
                      str3 += `${targetCompanyName}<br/>${str}：${personArr.join(
                        "，"
                      )}<br/><span style="color:#FF6E6E">跳槽到</span>${
                        this.companyName
                      }`;
                    }
                    v.companySimInfoStr = str3;
                  }
                }
              }
            });
            this.competingGoodsData = data.cnCompanySort;
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    rankingRowClassName({ row, rowIndex }) {
      if (row.companyName === this.companyName) {
        return "highlight";
      }
    },
  },
  watch: {
    scoreArr() {
      for (let i = 0; i < this.scoreArr.length; i++) {
        if (this.scoreArr[i] === false) {
          return;
        }
      }
      this.getCompositeScore();
    },
    "$route.query.companyName"() {
      this.reload();
    },
  },
};
</script>

<style lang="scss" scoped>
.card-box {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.elcard {
  position: relative;
  flex: 0.5;
  text-align: left !important;
  ::v-deep {
    .el-card__header {
      position: relative;
      &:before {
        position: absolute;
        top: 50%;
        left: 0;
        width: 5px;
        height: 30px;
        margin-top: -15px;
        content: "";
        background-color: $color101;
      }
    }
  }
  .tit {
    font-size: 14px;
    font-weight: bold;
    i {
      color: #504da6;
    }
  }
  .achievements {
    position: relative;
    li {
      display: block;
      border-bottom: 1px solid #ebeef5;
      margin-bottom: 10px;
    }
  }
}
.overview-info {
  position: relative;
  margin-bottom: 20px;
  overflow: initial;
  .logo-box {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .info {
    min-height: 140px;
    padding-left: 160px;
    h2 {
      width: 100%;
      font-weight: bold;
      font-size: 18px;
      color: #4f515b;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .all-score {
      height: 34px;
      margin-top: 10px;
      font-size: 14px;
      color: #86899e;
      span {
        font-size: 24px;
        color: #504da6;
      }
    }
    .score-list {
      display: flex;
      align-items: center;
      margin-top: 10px;
      list-style: none;
      li {
        flex: 1;
        display: inline-flex;
        align-items: center;
        em {
          font-size: 14px;
          color: #86899e;
        }
        .score-star {
          margin-right: 10px;
        }
        i {
          font-style: normal;
          color: #86899e;
        }
      }
    }
  }
  .nav {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 50px;
    text-align: center;
    font-size: 14px;
    color: #4f515b;
    background-color: #f3f6f9;
    & > div {
      position: relative;
      flex: 1;
      height: 50px;
      line-height: 50px;
      cursor: pointer;
      &:hover {
        .menu-box {
          display: block;
        }
      }
      &.active {
        color: #fff;
        // background-color: rgba(80,77,165,0.9);
        background-color: #504da5;
      }
      .menu-box {
        position: absolute;
        top: 50px;
        z-index: 9;
        display: none;
        width: 100%;
        .nav-menu {
          position: relative;
          width: 100%;
          margin-top: 14px;
          font-size: 14px;
          font-weight: bold;
          &.active {
            display: block;
          }
          &:before {
            position: absolute;
            top: -9px;
            left: 50%;
            display: block;
            width: 0;
            height: 0;
            border-color: transparent;
            border-width: 10px;
            border-top-width: 0;
            border-bottom-color: #fff;
            border-style: solid;
            margin-left: -10px;
            content: " ";
          }
        }
      }
    }
  }
}
.score-star {
  position: relative;
  display: inline-block;
  margin-bottom: 0;
  vertical-align: middle;
}
.score-star span {
  display: block;
  float: left;
  width: 16px;
  height: 16px;
  margin-left: 3px;
  border-radius: 4px;
  background-color: #d1d6e3;
  &.color1,
  &.color2,
  &.color3 {
    &:nth-of-type(1) {
      background-color: #87ceeb;
    }
    &:nth-of-type(2) {
      background-color: #87cefa;
    }
    &:nth-of-type(3) {
      background-color: #6495ed;
    }
    &:nth-of-type(4) {
      background-color: #4169e1;
    }
    &:nth-of-type(5) {
      background-color: #4169e1;
    }
  }
}
.score-star .color1 {
  // background-color: #4169E1;
  // background-color: #22dabe !important;
}
.score-star .color2 {
  // background-color: rgba(34,218,190,0.5) !important;
  // background-color: #fddf76 !important;
}
.score-star .color3 {
  // background-color: rgba(34,218,190,0.4) !important;
  // background-color: #fc3f4d !important;
}
.one-list-box {
  position: relative;
  left: 0;
  width: 100%;
  height: 30%;
  padding: 0 20px;
  overflow-y: auto;
}
.one-list {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  box-sizing: border-box;
  list-style: none;
  li {
    position: relative;
    width: 50%;
    padding-top: 6px;
    padding-bottom: 6px;
    // padding-right: 20px;
    box-sizing: border-box;
    cursor: pointer;
    &.active {
      p {
        font-weight: bold;
        color: #504da6;
      }
      i {
        color: #504da6;
      }
    }
    p {
      padding-right: 50px;
      font-size: 12px;
      color: #86899e;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      span {
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-right: 6px;
      }
    }
    i {
      position: absolute;
      top: 50%;
      right: 30px;
      line-height: 18px;
      margin-top: -9px;
      font-size: 12px;
      color: #86899e;
    }
  }
}
.btn-group {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
  button {
    height: 30px;
    padding: 4px 16px;
    border: 0;
    border-radius: 4px;
    margin-right: 20px;
    font-size: 12px;
    color: #86899e;
    background-color: #f3f5f8;
    outline: none;
    &.active {
      color: #fff !important;
      background-color: #504da6 !important;
    }
  }
}
.contrast {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  text-align: center;
  font-size: 16px;
  color: #fff;
  background-color: #909399;
  cursor: pointer;
  &.active {
    background-color: orange;
  }
}
/* 科技成果概况 */
.info1,
.info2,
.info3 {
  position: relative;
  margin-left: 20px;
  margin-right: 10px;
  margin-bottom: 10px;
}
.info1 span,
.info1 span,
.info3 span {
  float: left;
  display: block;
  line-height: 24px;
  margin-right: 20px;
  font-size: 14px;
  color: #4f515b;
}
.info2 {
  font-weight: bold;
  font-size: 14px;
  color: #504da6;
}
.info1 span i,
.info2 span i,
.info3 span i {
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: #4f515b;
}
.info3 span i {
  font-weight: normal;
  color: #504da6;
}
.patent-column {
  text-align: center;
  font-size: 12px;
  color: #241c75;
}
/* 企业技术综合评分 */
.range {
  display: flex;
  width: 100%;
  list-style: none;
  align-items: center;
  justify-items: center;
  padding-left: 0;
}
.range li {
  flex: 1;
  line-height: 40px;
  margin-right: 2px;
  text-align: center;
  font-size: 12px;
  background-color: #f5f5fe;
}
.range li:hover {
  color: #fff;
  background-color: $mainColor;
  cursor: pointer;
}
.range li:nth-of-type(1) {
  margin-left: 6px;
}
.range-active {
  font-weight: 600;
  color: #fff;
  background-color: $mainColor !important;
  cursor: pointer;
}
.evaluation-list {
  min-height: 330px;
  margin-right: 20px;
  list-style: none;
  li {
    margin-bottom: 10px;
  }
}
.evaluation-list .title {
  position: relative;
  margin-bottom: 0;
  line-height: 24px;
}
.evaluation-list .title span {
  float: left;
  display: block;
  font-weight: 600;
  font-size: 12px;
  color: #241c75;
}
.evaluation-list .title span:last-child {
  float: right;
}
.evaluation-list .vprogress {
  height: 10px;
  margin-top: 10px;
  margin-bottom: 10px;
  border-radius: 10px;
}

.evaluation-list .footer-tip {
  font-size: 12px;
  color: #7674a3;
}
.name {
  font-weight: bold;
}
.competingGoods-box {
  width: 100%;
  ::v-deep {
    /* 高亮样式 */
    .highlight,
    .highlight:hover {
      box-shadow: 1px 1px 3px #888888 !important;
      background-color: $mainColor !important;
      color: #fff;
    }
    .highlight > td {
      background-color: inherit !important;
      color: #fff;
    }
    .highlight .highcolor2 {
      color: #fff !important;
    }
  }
}
.highcolor {
  color: #528ec3;
}
.highcolor2 {
  color: #84c026;
}
.ps-title {
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.no-patent-tip {
  width: 100%;
  line-height: 1rem;
  padding: .1rem 0;
  font-size: .18rem;
  text-align: center;
  color: $color104;
}
</style>